<template>
    <ElFormItem :label="showLabel ? label.label + ':' : ''"
        v-if="!label.show || label.show({ data, type: 'form', isPhone: false })" :prop="label.prop"
        :style="{ width: typeof label.width === 'number' ? label.width + 'px' : label.width }">
        <component v-if="label.vform" :is="label.vform(prop, data, data[label.prop])">
        </component>
        <ElInput :placeholder="label.placeholder || '请输入' + label.label" v-model="data[label.prop]" :clearable="true"
            :maxlength="label.maxlength" show-word-limit :disabled="label.inpDisabled" :type="label.type || 'text'"
            v-else></ElInput>
    </ElFormItem>
</template>

<script setup lang="ts">
import type { interForm } from "@b/model/base/type";
import { ref, watch } from "vue";
import { ElInput, ElFormItem } from "element-plus";
interface prop {
    prop: string
    data: any
    label: interForm
    offsetWidth?: number
}
const props = defineProps<prop>()
const showLabel = ref(true)
watch(() => props.offsetWidth, (value) => {
    if (value && value < 370) {
        showLabel.value = false
    }
})
</script>